<template>
    <div class="index-right-top">
        <div class="index-right-topnav">
            <ul>
                <router-link to="" tag="div"><li>首页</li></router-link>
                <div v-if="isshow">
                    <router-link to="/home" tag="div"><li>业务中心</li></router-link>
                    <router-link to="/administer" tag="div"><li>我的业务</li></router-link>
                </div>

                <div v-if="!isshow">
                    <router-link to="" tag="div"><li>个人中心</li></router-link>
                    <router-link to="" tag="div"><li>实名认证</li></router-link>
                    <router-link to="" tag="div"><li>帮助手册</li></router-link>
                    <router-link to="" tag="div"><li>找回密码</li></router-link>
                </div>

            </ul>
        </div>
    </div>
</template>

<script>
export default {
    props:['isshow'],
}
</script>

<style lang="less" scope >
   .index-right-top{
       position: fixed;
       top: 0;
       z-index: 100;
       width: 100%;
       height: 60px;
       line-height: 60px;
       background-color: white;
       color: #8c8c8c;
       font-size: 12px;
        box-shadow:0px 2px 2px #8F8F8F;

       .index-right-topnav{
          ul li{
              float: left;
              padding-left: 10px;
              padding-right: 10px;
              margin-left: 10px;
              position: relative;
              cursor: pointer;
          } 
          ul li:first-child{
              margin-left: 30px;
          }
          ul li::after{
              content: "";
              display: block;
              position: absolute;
              height: 3px;
              width: 100%;
              background-color: #33cabb;
              bottom: 0px;
              left: 0px;
              z-index: 100;
              display: none;
          }
          ul li:hover::after{
            display: block;
          }

       }
   }
</style>